<template>
  <div>
    <h3 style="text-align: center;">查看商品</h3>
    <div style="height:250px">
      <el-table :data="cutObj.records" style="width: 100%" border stripe>
        <el-table-column prop="productName" label="商品名"/>
        <el-table-column prop="type" label="商品类型"/>
        <el-table-column prop="price" label="价格"/>
        <el-table-column fixed="right" label="操作">
          <template #default="scope">
            <el-button type="primary" size="small" @click="findByProductId(scope.row.productId)">查看</el-button>
            <el-button type="" size="small" @click="addScheme(scope.row.productId)">添加采购订单</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div style="margin: 20px">
      <el-pagination
          v-model:current-page="currentPage"
          v-model:page-size="cutObj.size"
          background
          layout="prev, pager, next, jumper"
          :total="cutObj.total"
          @current-change="findByProduct"
      />
    </div>


    <!--    查询商品-->
    <el-dialog
        v-model="showId"
        title="查询商品"
        width="40%">
      商品名：{{ productObj.productName }}<br>
      商品类型：{{productObj.type}}<br>
      商品价格：{{productObj.price}}<br>
      商品数量：{{productObj.num}}<br>
      <template #footer>
    <span class="dialog-footer">
    <el-button @click="showId = false">取消</el-button>
    <el-button type="primary" @click="showId = false">确定</el-button>
  </span>
      </template>
    </el-dialog>

    <el-button type="primary" size="small" @click="findBySheme">查询所有采购订单</el-button>

    <!--    查询所有采购订单-->
    <el-dialog
        v-model="showSheme"
        title="查询所有采购订单"
        width="70%"
        >
      <el-table :data="shemeObj">
        <el-table-column prop="idNum" label="采购订单编号"/>
        <el-table-column prop="procurementReason" label="采购理由"/>
        <el-table-column prop="status" label="审核状态"/>
        <el-table-column prop="applicant" label="采购申请人"/>
        <el-table-column prop="createDate" label="申请时间"/>
      </el-table>

      <template #footer>
    <span class="dialog-footer">
    <el-button type="primary" @click="showSheme = false">确定</el-button>
  </span>
      </template>
    </el-dialog>
    <!--    添加采购订单弹出框-->
    <el-dialog
        v-model="showAdd"
        title="添加采购订单"
        width="40%">
      采购理由：<el-input v-model="procurementReason" style="width: 200px"/> <br>
      采购数量：<el-input v-model="num" style="width: 200px"/> <br>
      采购申请人：<el-input v-model="applicant" style="width: 200px"/><br>
      <template #footer>
    <span class="dialog-footer">
    <el-button @click="showAdd = false">取消</el-button>
    <el-button type="primary" @click="add">确定</el-button>
  </span>
      </template>
    </el-dialog>

  </div>
</template>

<script>
import axios from "axios";

export default {
  data() {
    return {
      productId:"",
      procurementReason:"",
      num:"",
      applicant:"",
      productStr:"",
      showAdd:false,
      dialogVisible:false,
      status:"",
      showSheme:false,
      shemeObj:[],
      cutObj: {},
      currentPage: 1,
      showId: false,
      productObj:{},
    }
  }, methods: {
    findByProduct(pageNum) {
      this.currentPage = pageNum;
      axios.get("/project/scheme/productAll", {
        params: {
          pageNum
        }
      }).then(resp => {
        this.cutObj = resp.data;
      })
    },
    findByProductId(productId) {
      this.showId = true;
      axios.get("/project/scheme/productId",{
        params:{productId}
      }).then(resp=>{
        this.productObj= resp.data
        this.productStr = JSON.parse(this.productObj)
      })
    },
    findBySheme(){
      this.showSheme = true
      axios.get("/project/scheme/schemeAll").then(resp=>{
        this.shemeObj = resp.data
        if (this.shemeObj.status == "0"){
          alert(this.shemeObj.status)
          this.shemeObj.status = "未审核"
        }
      })
    },
    addScheme(productId){
      this.showAdd = true
      this.productId = productId
    },
    add(){
      axios.get("/project/scheme/addScheme",{
        params:{
          procurementReason:this.procurementReason,
          applicant:this.applicant,
          num:this.num,
          productId:this.productId
        }
      }).then(resp=>{
        if (resp.data.tag==0){
          this.$message({
            message: "发送成功",
            type: "success",
            showClose: true,
          });
        }else{
          this.$message({
            message: "发送失败",
            type: "error",
            showClose: true,
          });
        }
        this.procurementReason = null
        this.applicant = null
        this.showAdd = false
      })
    }
  },
  created() {
    this.findByProduct(1);
  }
}
</script>

<style scoped>

</style>